<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>我的服务</title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<link href="../css/mui.min.css" rel="stylesheet" />
		<link href="../css/iconfont.css" rel="stylesheet"/>
		<link rel="stylesheet" href="../css/default.css"/>
		<link rel="stylesheet" href="../css/MUIxinyingCss.css"/>
	</head>
	<body class="mui-fullscreen">
		<!--页面主结构开始-->
		<div id="myServiceApp" class="mui-views">
			<div class="mui-view">
				<div class="mui-navbar">
				</div>
				<div class="mui-pages">
				</div>
			</div>
		</div>
		<!--页面主结构结束-->
		<!--单页面开始-->
		<!--预约门诊医生列表-->
		<div id="myService" class="mui-page">
			<div class="mui-navbar-inner mui-bar mui-bar-nav header_bar">
				<button type="button" class="mui-left mui-action-back mui-btn  mui-btn-link mui-btn-nav mui-pull-left">
					<span class="mui-icon mui-icon-left-nav"></span>
				</button>
				<h1 class="mui-center mui-title">预约门诊医生列表</h1>
			</div>
			<div class="mui-page-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll height100">
						<div class="mui-page-content height100">
							<div class="mui-content my_service_box height100">
							<div>
								<div class="mui-segmented-control mui-segmented-control-inverted mui-segmented-control-primary my_service_tab">
									<a class="mui-control-item mui-active" href="#service_history">
										服务历史
									</a>
									<a class="mui-control-item" href="#my_doctors">
										我的医生
									</a>
								</div>
							</div>
							<div class="height100">
								<div id="service_history" class="mui-control-content mui-active height100">
									<div id="scroll" class="mui-scroll-wrapper">
										<div class="mui-scroll">
											<ul class="mui-table-view my_service_list">
												<li class="mui-table-view-cell">
													<a href="#free_record" class="mui-navigate-right">
														<span class="iconfont icon-xinxi"></span>
														免费咨询记录
													</a>
												</li>
												<li class="mui-table-view-cell">
													<a href="#img_record" class="mui-navigate-right">
														<span class="iconfont icon-xinxi2"></span>
														图文咨询记录
													</a>
												</li>
												<li class="mui-table-view-cell">
													<a href="#appointment_record" class="mui-navigate-right">
														<span class="iconfont icon-menzhenyuyue"></span>
														门诊预约服务记录
													</a>
												</li>
											</ul>
										</div>
									</div>
								</div>
								<div id="my_doctors" class="mui-control-content">
									<ul class="mui-table-view free_advice_list">
							            <li class="mui-table-view-cell">
							            	<span class="mui-badge-danger mui-badge-inverted my_float_right add_padding">我购买过的</span>
							            	<div class="mui-col-xs-2">
												<img src="../images/doctor_img.png" alt="img">
							            	</div>
							            	<div class="mui-col-xs-7">
							            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
							            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
							            	</div>
							            </li>
							            <li class="mui-table-view-cell"> 
							            	<span class="mui-badge-danger mui-badge-inverted my_float_right add_padding">我购买过的</span>
							            	<div class="mui-col-xs-2">
												<img src="../images/doctor_img.png" alt="img">
							            	</div>
							            	<div class="mui-col-xs-7">
							            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
							            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
							            	</div>
							            </li>
							            <li class="mui-table-view-cell"> 
							            	<span class="mui-badge-danger mui-badge-inverted my_float_right add_padding">我购买过的</span>
							            	<div class="mui-col-xs-2">
												<img src="../images/doc_list@2x.png" alt="img">
							            	</div>
							            	<div class="mui-col-xs-7">
							            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
							            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
							            	</div>
							            </li>
							        </ul>
								</div>
							</div>
							</div>
				</div>
					</div>
				</div>
			</div>
		</div>
		<!--单页面结束-->
		<!--免费咨询记录-->
		<div id="free_record" class="mui-page">
			<div class="mui-navbar-inner mui-bar mui-bar-nav header_bar">
				<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
					<span class="mui-icon mui-icon-left-nav" style=""></span>
				</button>
				<h1 class="mui-center mui-title">免费咨询记录</h1>
			</div>
			<div class="mui-page-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scrol">
						<ul class="mui-table-view free_advice_list">
				            <li class="mui-table-view-cell">
				            	<span class="mui-badge mui-badge-success">已回复</span>
				            	<h1>妇科病的觉症状有哪些？</h1>
				            	<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-success">已回复</span>
				            	<h1>妇科病的觉症状有哪些？</h1>
				            	<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-danger">待回复</span>
				            	<h1>妇科病的觉症状有哪些？</h1>
				            	<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            </li>
				        </ul>
					</div>
				</div>
			</div>
		</div>
		<!--图文咨询记录-->
		<div id="img_record" class="mui-page">
			<div class="mui-navbar-inner mui-bar mui-bar-nav header_bar">
				<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
					<span class="mui-icon mui-icon-left-nav" style=""></span>
				</button>
				<h1 class="mui-center mui-title">图文咨询记录</h1>
			</div>
			<div class="mui-page-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scrol">
						<ul class="mui-table-view free_advice_list">
				            <li class="mui-table-view-cell">
				            	<span class="mui-badge mui-badge-success">已结束</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doctor_img.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-success">已结束</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doctor_img.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-danger">进行中</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doc_list@2x.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				        </ul>
					</div>
				</div>
			</div>
		</div>
		<!--门诊预约记录-->
		<div id="appointment_record" class="mui-page">
			<div class="mui-navbar-inner mui-bar mui-bar-nav header_bar">
				<button type="button" class="mui-left mui-action-back mui-btn mui-btn-link mui-btn-nav mui-pull-left">
					<span class="mui-icon mui-icon-left-nav" style=""></span>
				</button>
				<h1 class="mui-center mui-title">门诊预约记录</h1>
			</div>
			<div class="mui-page-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scrol">
						<ul class="mui-table-view free_advice_list">
				            <li class="mui-table-view-cell">
				            	<span class="mui-badge mui-badge-success">已结束</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doctor_img.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-success">已结束</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doctor_img.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				            <li class="mui-table-view-cell"> 
				            	<span class="mui-badge mui-badge-danger">进行中</span>
				            	<div class="mui-col-xs-2">
									<img src="../images/doc_list@2x.png" alt="img">
				            	</div>
				            	<div class="mui-col-xs-7">
				            		<h1 class="mui-ellipsis">您好！您好！您好！您好！</h1>
				            		<p><time>2015-12-12</time> ｜ <span>妇科</span></p>
				            	</div>
				            </li>
				        </ul>
					</div>
				</div>
			</div>
		</div>
		<script src="../js/mui.min.js"></script>
		<script src="../js/jquery-1.11.2.min.js"></script>
		<script src="../js/mui.view.js "></script>
	</body>
<script>
mui.init();
//初始化单页view
var viewApi = mui('#myServiceApp').view({
	defaultPage: '#myService'
});
//初始化单页的区域滚动
mui('.mui-scroll-wrapper').scroll();
var view = viewApi.view;
(function($) {
	//处理view的后退与webview后退
	var oldBack = $.back;
	$.back = function() {
		if (viewApi.canBack()) { //如果view可以后退，则执行view的后退
			viewApi.back();
		} else { //执行webview后退
			oldBack();
		};
	};
})(mui);
		
</script>
</html>